<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ page import="java.net.*" %>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
	String urlPath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ "/";
%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width" />
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="application-name" content="移动版">
    <title>比赛介绍</title>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/common.css" />
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/index.css" />
<%--     <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/jsp/gameList/css/common.css" /> --%>
    <script src="${pageContext.request.contextPath}/jsp/gameList/js/jquery-1.8.3.min.js"></script>
	<script src="${pageContext.request.contextPath}/jsp/gameList/js/jquery.mobile-1.3.2.min.js"></script>
<!--     <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css"> -->
<!-- 	<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script> -->
<!-- 	<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script> -->
</head>
<body>
<form id="formforword" name="formforword" method="post" action="<%=path %>/regis/forword" >
	<input type="hidden" name="matchId" id="matchId" value="${matchId}" ></input>
  	<input type="hidden" name="shopId" id="shopId" value="${shopId}" ></input>
  	<input type="hidden" name="songId" id="songId" value="${songId}" ></input>
  	<input type="hidden" name="songName" id="songName" value="${songName}" ></input>
  	<input type="hidden" name="singerId" id="singerId" value="${singerId}" ></input>
  	<input type="hidden" name="singerName" id="singerName" value="${singerName}" ></input>
  	<input type="hidden" name="mp3Id" id="mp3Id" value="${mp3Id}" ></input>
  	<input type="hidden" name="url" id="url" value="${url}" ></input>
  	<input type="hidden" name="sign" id="sign" value="${sign}" ></input>
</form>
<!--头部-->
<header>
    <div class="head">
        <a href="javascript:void(0);" onclick="history.go(-1)"></a>
        <span>比&nbsp;赛&nbsp;介&nbsp;绍</span>
        <img src="<%=path %>/img/logo.png" alt="" >
    </div>
</header>
<div id="ggggg" class="container">
    <!--比赛介绍-->
    <section>
        <div class="headline">
            <h3>${data.name}</h3>
            <p class="hl_counter"><b>歌曲名称:</b><c:if test="${songName!='1'}">《<span class="fixation-width">${songName}</span>》</c:if></p>
            <p class="hl_counter">
            	<b>参赛人数:</b>
            	<span>${data.entryWorksCount}</span>
            	<c:if test="${status==0||status==1}">
                    <a id="entergm" href="javascript:toQRCode();" >
            			预定KTV录音参赛
            		</a>
				</c:if>
				<c:if test="${status==2}">
					<a id="entergm" href="javascript:show();" >
<%-- 					<a href="<%=path %>/gameList/signup?shopId=${shopId}&songId=${songId}&songName=${songName}&singerId=${singerId}&singerName=${singerName}&mp3Id=${mp3Id}&url=${url}" id="entergm"> --%>
            			报名参赛
            		</a>
				</c:if>
				<c:if test="${status==3}">
					<a id="entergm">
            			比赛已结束
            		</a>
				</c:if>
            </p>
            <p><b>比赛时间:</b><span>${fn:substring(data.beginTime,0,16)}</span><span>至</span><span>${fn:substring(data.endTime,0,16)}</span><span></span></p>
        </div>
        <div class="section">
        	<c:if test="${null==data.bannerPath}">
            	<img src="${pageContext.request.contextPath}/img/banner.png" alt="">
			</c:if>
			<c:if test="${null!=data.bannerPath}">
            	<img src="${pageContext.request.contextPath}${data.bannerPath}" alt="">
			</c:if>
        </div>
    </section>
    <!--导航-->
    <nav>
        <div class="navigation">
            <ul class="menus">
            	<c:if test="${status==1}">
                    <li class="first tabin">活动介绍</li>
                	<li>参赛规则</li>
                	<li>奖品奖励</li>
                	<li class="last">当前排名</li>
				</c:if>
				<c:if test="${status==0||status==2||status==3}">
					<li class="first">活动介绍</li>
                	<li>参赛规则</li>
                	<li>奖品奖励</li>
                	<li class="last tabin">当前排名</li>
				</c:if>
            </ul>
        </div>
        <div class="parent-element">
        <c:if test="${status==1}">
            <div class="contentfirst content">
				<textarea name="" readonly="readonly">${data.introduce}</textarea>        
			</div>
        	<div class="contentfirst">
            	<textarea name="" readonly="readonly">${data.rule}</textarea>
        	</div>
        	<div class="contentfirst">
        		<textarea name="" readonly="readonly">${data.prize}</textarea>
        	</div>
        	<div class="contentfirst">
            	<p>比赛正尚未开始...，比赛开始后将发布排名信息</p>
        	</div>
		</c:if>
		<c:if test="${status==0||status==2||status==3}">
			<div class="contentfirst">
				<textarea name="" readonly="readonly">${data.introduce}</textarea>
			</div>
        	<div class="contentfirst">
            	<textarea name="" readonly="readonly">${data.rule}</textarea>
        	</div>
        	<div class="contentfirst">
        		<textarea name="" readonly="readonly">${data.prize}</textarea>
        	</div>
        	<div class="contentfirst content-up content" id="load-more">
        	</div>
		</c:if>
		</div>
    </nav>
</div>
<div class="mask-layer" id="new-share"></div>
<div class="repeat-apply reminder" id="succeed">
<!--     <p class="repeat-text"> -->
<!--         <img src="../img/face.png" alt="" class="sign-img"> -->
<!--        	<span class="sign-up">亲，这首录音歌曲，已经被其他用户参赛了～</span> -->
<!--         <a href="production.html" class="canvass">选择其他比赛</a> -->
<!--     </p> -->
</div>
<!--返回顶部-->
<img src="../img/top.png" alt="" id="tap_top" class="back-top">

<script type="text/javascript" src="${pageContext.request.contextPath}/h5js/zepto.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/h5js/touch.js"></script>
<%-- <script type="text/javascript" src="${pageContext.request.contextPath}/h5js/introduce.js"></script> --%>
<script>
	var loadMore;
	var pagenum = 1;
	var rownum = 5;

    $(function(){
        $(".container li").each(function(index){
            $(this).tap(function(){
                $("div.content").removeClass("content");
                $(".container li.tabin").removeClass("tabin");
                $(".contentfirst").eq(index).addClass("content");
                $(this).find(".content");
                $(this).addClass("tabin")
            })
        });
        
        $(window).bind("scroll", function () {
            if(document.body.scrollTop){
                if(document.body.scrollTop>80){
                    $("#tap_top").css({
                        "display":"block"
                    })
                }else{
                    $("#tap_top").css({
                        "display":"none"
                    })
                }
            }
        });
        
        setInterval(function(){
            if(document.body.scrollTop<80){
                $("#tap_top").css( "display","none")
            }
        },500);
        
        $("#tap_top").click(function(){
            document.body.scrollTop=0;
            $("#tap_top").css( "display","none")
        });
        
        /* $("#load-more").swipe(function(){
//         	$(this).append(loadmore())
        	loadmore();
        }); */
        
        loadmore();
        
        $("#load-more").on("scrollstart",function(event){
        	//alert(event.type);
   		 	loadmore();
   	  	});
        
    });
    
  /*   function reswipe(){
    	$("#load-more").unbind();//这就是关键核心
    	$("#load-more").bind("swipe", function(){
        	$(this).append(loadmore())
//         	pagenum = pagenum + rownum;
        	reswipe();
        });
    } */
    
    function loadmore(){
    	var path = '<%=path %>';
    	$.ajax({  
          	type: "POST",  
            url: path+'/gameList/entryinfo',  
            data: {'matchId':${matchId},'pagenum':pagenum,'rownum':rownum},
            //url: path+'/gameList/entryinfo?matchId='+matchId+'&pagenum='+pagenum+'&rownum='+rownum, 
            cache: false,  
            async: false,
            dataType : "json",  
            success: function(data){
            	var loadMore = '';
            	for(var i=0;i<data.list.length;i++){
            		//alert(data.list[i].usr_imgPath);
            		var str = '<img src="'+path+data.list[i].usr_imgPath+'" alt="">';
            		if(''==data.list[i].usr_imgPath || null==data.list[i].usr_imgPath){
            			str = '<img src="../img/center.png" alt="">';
    				}
            		loadMore = loadMore 
            					+'<a href="javascript:toShow(\''+path+'\',\''+data.list[i].id+'\');">'
            					//+'<a href="'+path+'/usrMatch/show?usrMatchId='+data.list[i].id+'" >'
                				+'<div class="img-content">'
                				+'<div class="right-img">'
                				+str
                				+'</div>'
                				+'<p class="nickname">'
                				+'<span>'+data.list[i].person_name+'</span>'
                				+'<br><span>'+data.list[i].song_name+'</span>'
                				+'</p>'
                				+'<p class="ballot">'
                				+'<span>票数:</span> <span>'+data.list[i].exam_count+'</span>'
                				+'</p>'
                				+'</div>'
    							+'</a>';
    							
            	}
            	$("#load-more").append(loadMore);
            	if(data.list.length<rownum){
            		$("#loading").remove();//删除加载
            		$("#load-more").append('<div id="loading" style="color:red;text-align:center;padding:0.8rem 0" >已显示全部数据</div>');//出现加载
            	}
            	pagenum++;
            },
            error: function(){
            }
        });
    }
    
    
    function show(){
    	var path = '<%=path %>';
    	$.ajax({  
          	type: "POST",  
            url: path+'/gameList/signupcheck',
            //url: path+'/gameList/signupcheck?shopId=1&songId=1&singerId=1&&mp3Id=20&isAllSong=1',
            data:{'matchId':${matchId},'songId':${songId},'singerId':${singerId},'mp3Id':${mp3Id},'isAllSong':${data.isAllSong}},
            cache: false,  
            async: false,
            dataType : "json",  
            success: function(data){
            	if(0==data.status){
            		$("#succeed").append('<p class="repeat-text">'+
                    					'<img src="../img/face.png" alt="" class="sign-img">'+
                   						'<span class="sign-up">亲，这首录音歌曲，已经被其他用户参赛了～</span>'+
                    					'<a href="javascript:toProduction();" class="canvass">选择其他比赛</a>'+
                						'</p>');
            		$("#succeed").show();
                    $("#new-share").show();
            	}else if(1==data.status){
            		var dynamicForm = document.getElementById("formforword");
            		dynamicForm.submit();
            		//$("#formforword").submit();
            	}else if(2==data.status){
            		$("#succeed").append('<p class="repeat-text">'+
        					'<img src="../img/face.png" alt="" class="sign-img">'+
       						'<span class="sign-up">亲，您选的这首歌曲，不在本次参赛曲目范围内～</span>'+
        					'<a href="javascript:toProduction();" class="canvass">选择其他比赛</a>'+
    						'</p>');
            		$("#succeed").show();
                    $("#new-share").show();
            	}
            },
            error: function(){
            }
        });
    }
    
    function toProduction(){
    	var path = '<%=path %>';
    	var dynamicForm = document.getElementById("formforword");
		dynamicForm.setAttribute("action",path+"/gameList/index");
		dynamicForm.submit();
    	//$("#formforword").attr("action",path+"/gameList/index"); 
    	//$("#formforword").submit();
    }
    
    function toShow(path,id){
    	//alert(path+'/usrMatch/show?usrMatchId='+id)
    	window.location.href=path+'/usrMatch/show?usrMatchId='+id;
    }
    
    function toQRCode(path,id){
    	var path = '<%=path %>';
    	window.location.href=path+'/html/show_index.html';
    }
    
</script>
</body>
</html>